<template>
    <div>
        <div class="iviv-sa">
            <div class="vivo-er">
                <div class="ivi-qs">
                    基本信息
                </div>
                <p class="ivi-qs fof">
                    单号:100230
                </p>
            </div>
            <div class="vivo-a">
                <div class="goods">
                    <div class="goods-a link">
                       供货厂商: A 供货商
                    </div>
                    <div class="goods-b link">
                        付款类型: 货到付款
                    </div>
                    <div class="goods-c link">
                        审批人: A 员工
                    </div>
                    <div class="goods-d link">
                        采购日期 :
                    </div>
                </div>
            </div>
        </div>
        <div class="vivo-ej">
            <div class="vivo-se">审批状态</div>
            <div class="vivo-b">
                审批建议: 无
            </div>
        </div>

          <div>
              <el-table
                      :data="tableData"
                      border
                      style="width: 100%">
                  <el-table-column
                          fixed
                          prop="date"
                          label="序号"
                          width="80">
                  </el-table-column>
                  <el-table-column
                          prop="name"
                          label="商品名称"
                          width="150">
                  </el-table-column>
                  <el-table-column
                          prop="province"
                          label="单价/大单位"
                          width="130">
                  </el-table-column>
                  <el-table-column
                          prop="city"
                          label="数量"
                          width="130">
                  </el-table-column>
                  <el-table-column
                          prop="address"
                          label="单价/小单位"
                          width="130">
                  </el-table-column>
                  <el-table-column
                          prop="nameber"
                          label="数量"
                          width="130">
                  </el-table-column>
                  <el-table-column
                          prop="fming"
                          label="金额"
                          width="130">
                  </el-table-column>
                  <el-table-column
                          prop="beid"
                          label="备注"
                          width="120">
                  </el-table-column>

              </el-table>
          </div>
    </div>
</template>

<script>
    export default {
        name: "ProCai",
        methods: {
            handleClick(row) {
                console.log(row);
            }
        },

        data() {
            return {
                tableData: [{
                    date: '1001',
                    name: '商品名称',
                    province: '100.00/箱',
                    city: '9',
                    address: '10.00/瓶',
                    nameber:'56',
                    fming:'999.00',
                    beid:'/'
                },
                    {
                        date: '1002',
                        name: '商品名称',
                        province: '100.00/箱',
                        city: '9',
                        address: '10.00/瓶',
                        nameber:'56',
                        fming:'999.00',
                        beid:'/'
                    },
                    {
                        date: '1003',
                        name: '商品名称',
                        province: '100.00/箱',
                        city: '9',
                        address: '10.00/瓶',
                        nameber:'56',
                        fming:'999.00',
                        beid:'/'
                    },
                    {
                        date: '1004',
                        name: '商品名称',
                        province: '100.00/箱',
                        city: '9',
                        address: '10.00/瓶',
                        nameber:'56',
                        fming:'999.00',
                        beid:'/'
                    },
                    {
                        date: '1005',
                        name: '商品名称',
                        province: '100.00/箱',
                        city: '9',
                        address: '10.00/瓶',
                        nameber:'56',
                        fming:'999.00',
                        beid:'/'
                    },
                    {
                        date: '1006',
                        name: '商品名称',
                        province: '100.00/箱',
                        city: '9',
                        address: '10.00/瓶',
                        nameber:'56',
                        fming:'999.00',
                        beid:'/'
                    },
                    {
                        date: '1007',
                        name: '商品名称',
                        province: '100.00/箱',
                        city: '9',
                        address: '10.00/瓶',
                        nameber:'56',
                        fming:'999.00',
                        beid:'/'
                    },
                    {
                        date: '1008',
                        name: '商品名称',
                        province: '100.00/箱',
                        city: '9',
                        address: '10.00/瓶',
                        nameber:'56',
                        fming:'999.00',
                        beid:'/'

                }]
            }
        }
    }
</script>

<style  type="scss" scoped>

    .iviv-sa{
        border:1px solid #918f8f;
        font-size: 13px;
    }
    .vivo-er{
        width:100%;
        height: 35px;
        background: #e4e4e4;
        /*border:1px solid #918f8f;*/
        line-height:35px;

    }

    .vivo-ej{
        margin-bottom:20px;
        border:1px solid #918f8f;
        margin-top: 20px;
        font-size:13px;
    }

.vivo-a{
    width:100%;
    height: 45px;
    line-height:45px;

}
.vivo-b{
    width:100%;
    height:45px;
    line-height: 45px;
}
    .vivo-se{
        width:100%;
        height: 35px;
        background: #e4e4e4;
        line-height: 35px;
    }
    .ivi-qs{
        float:left;
    }
    .fof{
        position: relative;
        left:820px;
    }

    .link{
        float: left;
        margin-left: 130px;
    }
</style>